<template>
  <div>
    <base-header class="pb-6 pb-8 pt-5 pt-md-6 bg-gradient-success">
      <!-- Card stats -->
    </base-header>
    <b-container fluid class="mt--7">
      <b-row>
        <b-col>
          <el-card>
            <table class="myTable">
              <thead>
                <th>课程名称</th>
                <th>上课时间</th>
                <th>上课教室</th>
                <th>讲课教师</th>
                <th>操作</th>
              </thead>
              <tbody>
                <tr>
                  <td>高等数学</td>
                  <td>第3周-第9周</td>
                  <td>Z308</td>
                  <td>马保国</td>
                  <td><button class="myButton">退课</button></td>
                </tr>
                <tr>
                  <td>高等数学</td>
                  <td>第3周-第9周</td>
                  <td>Z308</td>
                  <td>马保国</td>
                  <td><button class="myButton">退课</button></td>
                </tr>
              </tbody>
            </table>
          </el-card>
        </b-col>
      </b-row>
    </b-container>
  </div>
</template>
<script>
import axios from "axios";

export default {};
</script>
<style scoped>
.myTable {
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 1em;
  border: solid 0.2em #dfdfdf;
}
.myTable th {
  border-bottom: solid 0.1em #dfdfdf;
  border-right: solid 0.1em #dfdfdf;
  border-left: solid 0.1em #dfdfdf;
}
.myTable td {
  border-bottom: solid 0.1em #dfdfdf;
  border-right: solid 0.1em #dfdfdf;
  border-left: solid 0.1em #dfdfdf;
  border-top: solid 0.1em #dfdfdf;
}
.myTable th:last-child,
td:last-child {
  border-right: solid 0em #dfdfdf;
}
.myTable th:first-child,
td:first-child {
  border-left: solid 0em #dfdfdf;
}

.myTable tr:last-child td {
  border-bottom: solid 0em #dfdfdf;
}
.myTable {
  width: 100%;
  text-align: center;
}

.myTable th,
td {
  height: 3em;
}
.myButton {
  width: 100%;
  height: 100%;
  border: none;
  background-color: transparent;
  color: #33cc33;
}
.myButton:hover {
  color: #ff6666;
}
</style>
